<template>
  <lay-layer v-model="visible" :shade="true" :shadeClose="false" shadeOpacity="0.2" :area="['360px', '270px']" :btn="action">
    <div style="padding: 20px">
      <lay-form :model="resetUserPasswordBo" ref="formRef">
        <lay-form-item label="新密码" prop="newPassword" required>
          <lay-input v-model="resetUserPasswordBo.newPassword" ></lay-input>
        </lay-form-item>
        <lay-form-item label="确认密码" prop="confirmPassword" required>
          <lay-input v-model="resetUserPasswordBo.confirmPassword"></lay-input>
        </lay-form-item>
      </lay-form>
    </div>
  </lay-layer>
</template>
<script setup lang="ts">
import {ref} from 'vue'
import { resetUserPassword} from "@/api/module/user";
import useFxwForm from "@/hooks/useFxwForm";

const {changeVisible,visible} = useFxwForm()

const props = defineProps({
  id: {
    type: Number,
    default: 0
  }
});
const formRef = ref();

const resetUserPasswordBo = ref({
  id: 0,
  newPassword: '',
  confirmPassword: '',
})

const action = ref([
  {
    text: "确认",
    callback: () => {
      resetUserPasswordBo.value.id = props.id;
      resetUserPassword(resetUserPasswordBo.value).then(res=>{
        if (res.code === 200) {
          changeVisible();
        }
      })
    }
  },
  {
    text: "取消",
    callback: () => {
      changeVisible();
    }
  }
])

defineExpose({
  changeVisible
})

</script>

<style scoped>


</style>